<template>
	<view>
		<text>购物车案例</text>
	</view>
	<view class="box">
		<view class="item" v-for="(item,index) in goods" :key="item.id">
			<checkbox></checkbox>
			<text class="title">{{item.name}}</text>
			<text class="del" @click="remove(index)">删除</text>
		</view>
	</view>
</template>

<script setup>
	import {ref} from 'vue';
	const goods = ref([
		{id:11,name:"小米"},
		{id:11,name:"华为"},
		{id:11,name:"open"},
		{id:11,name:"vivo"},
		{id:11,name:"荣耀"},
	])
	function remove(index){
		goods.value.splice(index,1)
	}
</script>
<style lang="scss" scoped>
	.box {
		padding: 10px;
		.item {
			padding: 10px 0;
			.del {
				color: red;
				margin-left: 10px;
			}
		}
	}       
</style>
